<!DOCTYPE html>
<html lang="en">
<head> 
<script src="../js/mdTohtml.js"></script>

<style>
        /* 讲义容器样式 */
    .notesContent{
        width: 95%;
        height: 100%;
        padding: 10px; 
        overflow-y:auto;
        border-width: 0px;
    }

    .notesContent::-webkit-scrollbar {
        width: 7px; /* 设置滚动条宽度 */
    }

    .notesContent::-webkit-scrollbar-thumb {
        background-color: rgb(152, 158, 170); /* 设置滚动条 thumb 颜色 */
        border-radius: 6px; /* 设置滚动条 thumb 圆角 */
    }

    .notesContent::-webkit-scrollbar-track {
    
        border-radius: 6px; /* 设置滚动条 track 圆角 */
    }
</style>

</head>

<body>
    <div class="notesContent" id="notesContent">
    </div>
</body>
</html>

<script>
    // var mdStringtest = "# 这是一个标题\n\n这是一段普通的文本，**这里是加粗的文本**。\n\n- 这是一个无序列表\n- 这是第二个列表项\n\n[这是一个链接]\n\n- 这是一个无序列表\n\n\n- 这是一个无序列表\n\n\n- 这是一个无序列表\n\n\n- 这是一个无序列表\n\n\n- 这是一个无序列表\n\n\n- 这是一个无序列表\n\n\n- 这是一个无序列表\n\n\n- 这是一个无序列表\n\n\n- 这是一个无序列表\n\n\n- 这是一个无序列表\n\n\n- 这是一个无序列表\n";
    // 将md字符串转换为html字符串

    function parseMarkdown(element) {
        // 获取元素的文本内容

        let text = JSON.parse(localStorage.getItem("summary"))

        console.log(text)
    
        // 如果文本为空，则返回空字符串
        if (text === "") return "";
    
        // 分割文本为每行内容
        let lines = text.split('\n');
    
        // 用于保存生成的 Markdown 文本
        let markdown = "";
    
        // 遍历每行内容
        lines.forEach(line => {
            // 检查是否以数字和句点开头
            if (/^\d+\.\s/.test(line)) {
                // 提取数字和句点后的内容
                let content = line.replace(/^\d+\.\s/, '');
    
                // 根据缩进确定标题级别
                let indent = line.search(/\S/);
                let level = (indent / 4) + 2;
    
                // 生成 Markdown 标题
                markdown += `${'#'.repeat(level)} ${content}\n`;
            } else {
                // 非标题行直接添加到 Markdown 中
                markdown += `${line}\n`;
            }
        });
    
        return markdown;
    }
    
    // 示例用法：解析指定元素并输出 Markdown 文本
    var mdContainer = document.getElementById("notesContent"); // 替换为你的元素 ID
    let markdownText = parseMarkdown(mdContainer);

    let html = marked.parse(markdownText);

    // 将转换后的 HTML 插入到指定的元素中
    mdContainer.innerHTML = html;

    console.log(markdownText);
    
    
    

</script>
